<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<html>
   <head>
	   <script>
		  function processURL() {
		    //document.getElementById("introblock").innerHTML = ''; //not needed; remove later
		    document.getElementById("answercheckblock").innerHTML = '';
			var operation = getCheckedRadio("sumdetail.operation");
			if(operation.length == '') {
			   alert('Please select the operation');
			   return;
			}  	
		  	var datastring = operation + "," +
		  	                 getComboSelected('digits') + "," +
		  	                 getComboSelected('decimaldigits') + "," +
		  	                 getComboSelected('datarows')
		  	                 
			url = '/lwf/algebraOld.do?action=selectoperation&datastring=' + datastring;
		    retrieveURL(url, 'questionblock');
		  }
		  
		  function checkAnswer() {
		  	var userans = document.aaform.useranswer.value;
			url = '/lwf/algebraOld.do?action=checkanswer&useranswer=' + userans;
		    retrieveURL(url, 'answercheckblock');
		  }
	   </script>
   </head>
 <html:form action="/algebraOld" >
   <table border="0" align="center" width="100%" bordercolor="red">
       <tr>
           <td class="title">Algebra</td>
       </tr> 
       <tr>
           <td>&nbsp;</td>
       </tr> 
           <bean:define id="digitsneeded" name="aaform" property="lstDropdownData" type="java.util.List" />
       <tr>
           <td>
               <table border="0" width="100%">
                  <tr>
                      <td width="18%" class="formLabel"><b>Select the operation:</b></td>
	                  <td width="3%"><html:radio property="sumdetail.operation" value="add" onclick="processURL()"/></td>
	                  <td width="8%" class="leftlabel">Add</td>
	                  <td width="3%"><html:radio property="sumdetail.operation" value="subtract" onclick="processURL()"/></td>
	                  <td width="8%" class="leftlabel">Subtract</td>
	                  <td width="3%"><html:radio property="sumdetail.operation" value="multiply" onclick="processURL()"/></td>
	                  <td width="8%" class="leftlabel">Multiply</td>  
	                  <td width="3%">&nbsp;</td> 
	                  <td width="8%" class="leftlabel">&nbsp;</td>
	                  <td width="43%" nowrap>&nbsp;</td>
	               </tr>
	               <tr>
	                   <td colspan="10">&nbsp;</td>
	               </tr>
	               <tr>
	                  <td colspan="10" align="center">
	                     <fieldset><legend><b>Select additional information</b></legend>
	                      <table>
				              <tr>    
				                  <td class="formLabel" colspan="4">
				                      <b>Number of digits needed: </b>
				                  </td>
				                  <td colspan="2">
				                      <html:select property="digits" onchange="processURL()">
				                          <html:options property="lstDropdownData"/>
				                      </html:select>
				                  </td>
				                  <td colspan="3">   
				                      <b>Example:</b> 5687 has 4 digits
				                  </td>                     
			                  </tr>	                      
				              <tr>    
				                  <td class="formLabel" colspan="4">
				                      <b>Data rows needed: </b>
				                  </td>
				                  <td colspan="2">
				                      <html:select property="datarows" onchange="processURL()">
				                          <html:options property="lstDataRows"/>
				                      </html:select>
				                  </td>
				                  <td colspan="3">   
				                      <b>Example:</b> 5687 + 5645+ 9898 has 3 rows (only for add)<br>
				                      222 + 333 has 2 rows
				                  </td>                     
			                  </tr>  
				              <tr>    
				                  <td class="formLabel" colspan="4">
				                      <b>Digits after the decimal point: </b>
				                  </td>
				                  <td colspan="2">
				                      <html:select property="decimaldigits" onchange="processURL()">
				                          <html:options property="lstDropdownData"/>
				                      </html:select>
				                  </td>
				                  <td colspan="3">   
				                      <b>Example:</b> 23.34 has two digits after the decimal point
				                  </td>                     
			                  </tr>
	                      </table>
	                     </fieldset> 
	                  </td> 
	              </tr>
               </table>
           </td>
       </tr> 
       <tr>
           <td>
               <span id="introblock">
                   
               </span>
           </td>
       </tr>         
       <tr>
           <td>
               <table border="0" width="100%">
                  <tr>
                      <td align="center">
                         <span id="answercheckblock"></span>
                      </td>
                  </tr>
                  <tr>
                      <td>
                         <span id="questionblock"></span>
                      </td>
                  </tr>                  
               </table>
           </td>
       </tr> 
   </table>  
</html:form>

</html>